<template>
    <div class="head"> <img src="https://img.axureshop.com/ee/00/de/ee00de2201bf478bb4a9d4f881afd706/images/考勤签到/u746.png"
            @click="returnPage" />
        <span
            style="font-size: 20px;font-family: '微软雅黑 Regular';font-weight: bold; margin-left: 5px;margin-right: 190px;">{{
                pageTitle }}</span>
        <span style="font-size: 14px;font-family:'微软雅黑 Regular' ;font-weight: bold;" @click="addText">新增</span>
    </div>

    <van-list v-model:loading="loading" @load="onLoad">
        <van-cell v-for="item in data" :key="item" :img="item.img">
            <div class="top">
                <div class="left">{{ item.title }}</div>
                <img v-if="item.img" class="right" :src="item.img" />
            </div>
            <div class="bottom">
                <span class="edit">{{ item.editor }}</span>
                <span class="space"></span>
                <span>{{ item.time }}</span>
                <span class="space"></span>
                <span
                    :class="{ 'blue': item.statu === '发布中', 'yellow': item.statu === '编辑中', 'pink': item.statu === '暂停发布' }">{{
                        item.statu }}</span>
            </div>
        </van-cell>
    </van-list>
</template>
  
<script setup>
import { ref, reactive, watch, computed } from "vue";
import { schoolMessageList } from "../../views/application/hooks"
import { useRoute, useRouter } from "vue-router";
import adminStore from "@/store/admin"
const myadminStore=adminStore()
const router = useRouter()
const route = useRoute()
// const list = ref([]);
const loading = ref(false);
const pageTitle = computed(() => {
    if (route.path === "/schoolMessage") {
        return "校园通知";
    } else if (route.path === "/schoolNotice") {
        return "校园新闻";
    } else if (route.path === "/classNotice") {
        return "班级通知";
    } else if (route.path === "/classTrends") {
        return "班级动态";
    } else {
        return "";
    }
});
const [data, onLoad] = schoolMessageList()

const returnPage = () => {
    router.replace('/application')

 myadminStore.setUserInfo(true)
}
const addText = () => {

    if (route.path === "/schoolMessage") {
        router.replace({
            path: "/addText",
            query: {
                title: "新增通知"
            }
        })
    } else if (route.path === "/classNotice") {
        router.replace({
            path: "/addText",
            query: {
                title: "新增通知"
            }
        })

    } else if (route.path === "/classTrends") {
        router.replace({
            path: "/addNotice",
            query: {
                title: "新增动态"
            }
        })

    } else {
        router.replace({
            path: "/addNotice",
            query: {
                title: "新增新闻"
            }
        })
    }

}


</script>
  
<style lang="scss" scoped>
.head {
    display: flex;
    height: 40px;
    align-items: center;
    margin-top: 10px;
    padding-left: 5px;
    margin-bottom: 20px;
}

.top {
    display: flex;
    height: 80px;
}

.left {
    font-family: "微软雅黑 Regular";
    font-size: 16px;
    color: #3c3b3d;
    text-align: left;
}

.right {
    width: 40%;
}

.bottom {
    display: flex;
}

.editor {
    color: #aab2bd;
    font-size: 12px;
}

.space {
    width: 8px;
}

.blue {
    color: #6CB6FF;
}

.yellow {
    color: #F9DF71
}

.pink {
    color: #F89AD8;
}
</style>